<template>
  <div id="app">
    <MenuBar />
    <!-- {{$store.state.title}} -->
    <!-- {{$store.state.count}} -->
    <!-- <button @click="addClick">增加</button> -->

    <ItemList></ItemList>
    <MemoEditor v-if="isShowEditModel"></MemoEditor>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";

import MenuBar from "./components/MenuBar.vue";
import ItemList from "./components/ItemList.vue";
import MemoEditor from "./components/MemoEditor.vue";

import { State } from "vuex-class";

@Component({
  components: {
    MenuBar,
    ItemList,
    MemoEditor
  }
})
export default class App extends Vue {
  // addClick() {
  // this.$store.commit("addCount", 5);
  // this.$store.dispatch("asyncAddCount", 2);
  // }
  @State("isShowEditModel") isShowEditModel: any;
}
</script>

<style>
* {
  padding: 0;
  margin: 0;
  list-style: none;
  /* box-sizing: border-box; */
}
body {
  background: url("./assets/pixels.png") repeat;
}
</style>
